import 'dart:io';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:earclean/app/config/colors.dart';
import 'package:earclean/app/modules/widget/app_bar_widget.dart';
import 'package:earclean/app/modules/widget/load_network_image_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';

import 'package:get/get.dart';

import '../controllers/info_controller.dart';

class InfoView extends GetView<InfoController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const AppBarWidget(
          backgroundColor: ColorConfig.white, titleStr: '个人详情页'),
      body: Obx(() => controller.info.isNotEmpty
          ? SingleChildScrollView(
              child: Column(
                children: [
                  //
                  swiperWidget(),
                  Container(
                    color: ColorConfig.white,
                    padding:
                        const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
                    child: Row(
                      children: [
                        Obx(() => Text(controller.nickname.value,
                            style: TextStyle(
                                fontSize: 16,
                                color: ColorConfig.body1_txt_color))),
                        SizedBox(width: 15),
                        Expanded(
                          child: Obx(() => Text(controller.infoStr.value,
                              style: TextStyle(
                                  fontSize: 14, color: Color(0xFF787878)))),
                        )
                      ],
                    ),
                  ),
                  Container(
                    width: 1.sw,
                    color: ColorConfig.white,
                    margin: EdgeInsets.symmetric(
                      vertical: 10,
                    ),
                    padding: const EdgeInsets.symmetric(
                      horizontal: 12,
                      vertical: 10,
                    ),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Expanded(
                          child: Text('服务项目',
                              style: TextStyle(
                                  fontSize: 15.sp,
                                  color: ColorConfig.app_main,
                                  fontWeight: FontWeight.w600)),
                        ),
                        InkWell(
                          onTap: controller.toUserComments,
                          child: Obx(() => Container(
                                alignment: Alignment.center,
                                height: 30,
                                child: Text(
                                    '共${controller.userCommentNum}条 好评${controller.pfr.value}',
                                    style: TextStyle(
                                        fontSize: 11, color: Colors.red)),
                              )),
                        ),
                        Container(
                          alignment: Alignment.center,
                          height: 30,
                          child: Text('>>',
                              style: TextStyle(
                                  fontSize: 11, color: Color(0xFF787878))),
                        )
                      ],
                    ),
                  ),
                  tuijianWidget1()
                ],
              ),
            )
          : Container()),
    );
  }

  Widget tuijianWidget1() {
    return Obx(() => Container(
          width: 1.sw,
          padding: EdgeInsets.symmetric(horizontal: 12),
          child: ListView.separated(
              padding: EdgeInsets.zero,
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              itemBuilder: ((context, index) {
                Map item = controller.serviceProjects[index];
                return Container(
                  padding: EdgeInsets.symmetric(horizontal: 12, vertical: 10),
                  decoration: BoxDecoration(
                    color: ColorConfig.white,
                    // border: Border.all(color: ColorConfig.app_main, width: .5),
                    borderRadius: BorderRadius.all(Radius.circular(10.r)),
                  ),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Container(
                        clipBehavior: Clip.hardEdge,
                        decoration: const BoxDecoration(
                          // border: Border.all(color: ColorConfig.app_main, width: .5),
                          borderRadius: BorderRadius.all(Radius.circular(8)),
                        ),
                        child: LoadNetworkImageWidget(
                            width: (1.sw - 36 - 16) / 3,
                            height: (1.sw - 36 - 16) / 3,
                            imageUrl: item['projectPic'] ?? ''),
                      ),
                      const SizedBox(width: 15),
                      Expanded(
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            const SizedBox(height: 5),
                            Text(item['projectName'] ?? '',
                                style: TextStyle(
                                  fontSize: 16.sp,
                                  color: ColorConfig.text_label,
                                )),
                            const SizedBox(height: 16),
                            Row(
                              children: [
                                Text("服务时长：${item['projectTimer'] ?? ''}",
                                    style: TextStyle(
                                      fontSize: 14.sp,
                                      color: Color(0xFF787878),
                                    )),
                              ],
                            ),
                            const SizedBox(height: 16),
                            Row(
                              children: [
                                Text("${item['projectPrice']}元/人",
                                    style: TextStyle(
                                      fontSize: 15.sp,
                                      color: Color(0xFFD9031D),
                                    )),
                                const Spacer(),
                                InkWell(
                                  onTap: () {
                                    controller.toYue(item);
                                  },
                                  child: Container(
                                    decoration: BoxDecoration(
                                      color: ColorConfig.app_main,
                                      // border: Border.all(color: ColorConfig.app_main, width: .5),
                                      borderRadius: BorderRadius.all(
                                          Radius.circular(5.r)),
                                    ),
                                    padding: const EdgeInsets.symmetric(
                                        horizontal: 13, vertical: 5),
                                    child: Text('预约',
                                        style: TextStyle(
                                          fontSize: 12.sp,
                                          color: ColorConfig.white,
                                        )),
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                );
              }),
              separatorBuilder: ((context, index) {
                return Container(height: 10);
              }),
              itemCount: controller.serviceProjects.length),
        ));
  }

  Widget swiperWidget() {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 16, vertical: 10),
      clipBehavior: Clip.hardEdge,
      decoration: const BoxDecoration(
        color: Colors.white,
      ),
      width: 1.sw,
      child: AspectRatio(
          aspectRatio: (1.sw - 36) / ((1.sw - 36) * 180 / (1.sw - 36)),
          child: Obx(() => Swiper(
              autoplay: true,
              loop: true,
              viewportFraction: 1,
              scale: 1,
              //自动轮播
              duration: 1000,
              key: ValueKey(controller.bannerList.length),
              itemBuilder: (c, i) {
                return InkWell(
                  onTap: () => {},
                  child: CachedNetworkImage(
                    imageUrl: controller.bannerList[i],
                    fit: BoxFit.cover,
                  ),
                );
              },
              itemCount: controller.bannerList.length))),
    );
  }
}
